<extend name="./ljfbase" />
    <block name="main">
        <script src="__PUBLIC__/js/jquery.min.js"></script>
        <div class="container mt30"><!-- 说说页面主体start -->
            <div class="row">
                <div class="col-md-10 col-md-offset-1">
                    <div class="ml15 mr15"><strong>我的说说</strong><hr></div>
                    <div class="col-md-9"><!-- 左侧start -->
                        <div class="create"><!-- 发表说说start -->
                            <textarea class="form-control" rows="3" name="content" placeholder="说说你的心情"></textarea><br>
                            <input type="file" name="pic[]" multiple="multiple" value="选择图片" id="pic"/>
                            <div>
                                <ul id="pic_tmp">
                                
                                </ul>    
                            </div>
                            <button class="action-subsay btn btn-primary">发表说说</button>
                        </div><!-- 发表说说end! -->
                        
                        <div id="saylist">
                            <volist name="saylist" id="say"><!-- 说说列表 start-->
                                <div class="row sayitem mt10">
                                    
                                    <div class="col-md-2"><!-- 说说头像start -->
                                        <a href="{:U('Home/Index/index',array('user_id'=>$vuser['id']))}">
                                            <img class="img-rounded" src="__PUBLIC__{$vuser.zonedp}" width="85" height="85" alt="头像">
                                        </a>
                                    </div><!-- 说说头像end! -->
                                    <!-- 说说内容块！start -->
                                    <div class="col-md-10 combody" style="border:1px solid #ccc;border-radius:5px">
                                        <div class="content mt10">
                                            <a href="{:U('Home/Index/index',array('user_id'=>$vuser['id']))}">{$vuser.nickname}</a>&nbsp&nbsp&nbsp&nbsp{$say[content]}
                                        </div>
                                        
                                        <if condition="$say.pic">
                                            <div class="sayimg">
                                                <foreach name='say.pic' item="vo">
                                                    <div class="pull-left mr6 mt6">
                                                        <img src="__PUBLIC__/uploads/{$vo}" width='180'  height="160">
                                                    </div>
                                                </foreach>
                                            </div>
                                        </if>
                                        <div class="clear"></div>
                                        <div class="row mt10">
                                            <div class="ctime col-md-4">
                                                {$say.ctime|date="Y-m-d H:i:s",###}
                                            </div>
                                            <div class="action col-md-3 col-md-offset-5">
                                                <a dataid={$say[id]} href="javascript:void(0)" class="act-fav"><if condition="$say.is_fav eq 1">取消赞<else/>赞({$say.fav})</if></a>
                                                <a href="{:U('edit',array('id'=>$say[id]))}">编辑</a>
                                                <a dataid={$say[id]} href="javascript:void(0)" class="act-del">删除</a>
                                            </div>
                                        </div>
                                        <hr>
                                        <!-- 每条说说的评论列表start -->
                                        <volist name="say['comment']" id="vo">
                                            <div class="media comitem">
                                                <a class="pull-left" href="{:U('Home/Index/index',array('user_id'=>$vo['user']['id']))}">
                                                    <img class="media-object img-rounded" src="__PUBLIC__{$vo.user.zonedp}" height="35" width="35" alt="头像">
                                                </a>
                                                <div class="media-body hfbody">
                                                    <p class="small" >
                                                        <strong><a href="{:U('Home/Index/index',array('user_id'=>$vo['user']['id']))}">{$vo.user.nickname}:</a></strong>
                                                        {$vo.content}

                                                    </p> 
                                                    <div class="small">
                                                        {$vo.ctime|date="Y-m-d H:i:s",###}
                                                        <a href="javascript:void(0)" class="act-com-hf" comid="{$vo.id}" hfid="{$vo.uid}">回复</a>
                                                        <a href="javascript:void(0)" class="act-com-del" dataid={$vo.id}>删除</a>
                                                    </div>
                                                    <!-- 每条评论的回复列表start -->
                                                    <volist name="vo['hflist']" id="val">
                                                        <div class="media replyitem">
                                                            <a class="pull-left" href="{:U('Home/Index/index',array('user_id'=>$val['user1']['id']))}">
                                                                <img class="media-object img-rounded" src="__PUBLIC__{$val.user1.zonedp}" height="35" width="35" alt="头像">
                                                            </a>
                                                            <div class="media-body">
                                                                <p class="small">
                                                                    <a href="{:U('Home/Index/index',array('user_id'=>$val['user1']['id']))}">{$val.user1.nickname}&nbsp;</a><a href="{:U('Home/Index/index',array('user_id'=>$val['user2']['id']))}">@{$val.user2.nickname}</a>:{$val.content}
                                                                </p> 
                                                                <div class="small">
                                                                    {$val.ctime|date="Y-m-d H:i:s",###}
                                                                    <a href="javascript:void(0)" class="act-com-hf" comid="{$vo.id}" hfid="{$val.uid}">回复</a>
                                                                    <a href="javascript:void(0)" class="act-hf-del" dataid={$val.id}>删除</a>
                                                                </div>                          
                                                            </div>
                                                        </div>
                                                    </volist><!-- 每条评论的回复列表end! -->
                                                    <div class="huifu"  style="display:none">
                                                        <textarea class="form-control" rows="2" name="content"  placeholder=""></textarea>
                                                        <button class="action-hf btn btn-primary btn-sm pull-right mt10">发表</button>
                                                    </div>                          
                                                </div>
                                            </div>
                                        </volist><!-- 每条说说的评论列表end! -->
                                        
                                        <!-- 对说说发表评论 start-->
                                        <div class="panel-footer mt10 md10 combtn">
                                            <textarea name="comment" class="form-control" rows="1" placeholder="我也说一句"></textarea>
                                            <button class="action-comment btn btn-primary btn-sm pull-right mt10 md10" value="{$say.id}">发表</button>
                                        </div><!-- 对说说发表评论 end-->
                                    </div><!-- 说说内容块！end -->
                                </div>
                            </volist><!-- 说说列表 end!-->
                            <center>{$page}</center><!-- 说说分页-->
                        </div><!-- 说说列表 end!-->
                    </div><!-- 左侧end -->
                    
                    <div cass="col-md-3"><!-- 右侧start -->
                        <div class="pull-left">
                            <img src="__PUBLIC__{$vuser.zonedp}" width="100" height="100" alt="头像">
                        </div>
                        
                        <div class="pull-left ml20">{$vuser.nickname}<br>
                        {$say_count}条说说</div>
                    </div><!-- 右侧end-->
                </div>
            </div>
        </div><!-- 说说页面主体end -->

        <script>
            //回复删除
            $('#saylist').on('click','.act-hf-del',function(){
                var self = $(this);
                var id = self.attr('dataid');
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Say/delhf")}',
                    data:{'id':id},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status == 'success'){
                            self.parents('div.replyitem').remove();
                        }else{
                            alert(rs.msg);
                        }
                    }
                });
            });
            //评论回复功能实现
            $("#saylist").on('click','.act-com-hf',function(){
                // debugger;
                var self1 = $(this);
                var comid = self1.attr('comid');
                var hfid = self1.attr('hfid');
                var div = self1.parents('div.hfbody').children(".huifu");
                div.show();
                self1.parents('div.combody').children('.combtn').hide();
                div.children('.action-hf').attr({ comid: comid, hfid: hfid });
            });
            $("#saylist").on('click','.action-hf',function(){
                var self2 = $(this);
                var comid = self2.attr('comid');
                var hfid = self2.attr('hfid');
                var content = self2.prev().val().trim();
                if(content.length==0){
                    return false;
                }
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Say/comhf")}',
                    data:{'com_id':comid,'hfid':hfid,'content':content},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status == 'success'){
                            var divs = '<div class="media replyitem">'+
                                        '<a class="pull-left" href="'+rs.url1+'">'+
                                            '<img class="media-object img-rounded" src="__PUBLIC__'+rs.zonedp1+'" height="35" width="35" alt="头像">'+
                                        '</a>'+
                                        '<div class="media-body">'+
                                            '<p class="small" >'+
                                                '<a href="'+rs.url1+'">'+rs.name1+'&nbsp</a><a href="'+rs.url2+'">@'+rs.name2+'</a>:'+rs.content+
                                            '</p> '+
                                            '<div class="small">'+
                                                rs.ctime+
                                                '<a href="javascript:void(0)" class="act-com-hf" comid="'+comid+'" hfid="'+hfid+'">回复</a>'+
                                                '<a href="javascript:void(0)" class="act-hf-del" dataid='+rs.id+'>删除</a>'+
                                            '</div> '+                         
                                        '</div>'+
                                    '</div>';
                            self2.parent().before(divs);
                            self2.prev().val(''); // 清空输入框
                            self2.parent().hide();
                            self2.parents('div.combody').children('.combtn').show();
                        }
                    }
                });
            });

            //点赞功能实现
            $("#saylist").on('click','.act-fav',function(){
                var self=$(this);
                var id=self.attr('dataid');
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Say/fav")}',
                    data:{'id':id},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status=='success'){
                            self.html(rs.btn);
                        } else {
                            alert(rs.msg);
                        }
                    }
                });
            });
            //ajax删除评论
            $('#saylist').on('click','.act-com-del',function(){
                var self = $(this);
                var id=self.attr('dataid');
                $.ajax({
                    type: "POST",
                    url: "{:U('delcom')}",
                    data: {'id':id},
                    dataType: "json",
                    success: function(rs){
                        if(rs.status == 'success'){
                            self.parents('div.comitem').remove();
                        }else{
                            alert(rs.msg);
                        }
                    }
                });
            });

            //ajax删除说说
            $('#saylist').on('click','.act-del',function(){
                var self = $(this);
                var id=self.attr('dataid');
                $.ajax({
                    type: "POST",
                    url: "{:U('del')}",
                    data: {'id':id},
                    dataType: "json",
                    success: function(rs){
                        if(rs.status == 'success'){
                            self.parents('div.sayitem').remove();
                        }else{
                            alert(rs.msg);
                        }
                    }
                });
            });

            //提交评论
            $('#saylist').on('click','.action-comment',function(){
                var self = $(this);
                var content = $(this).prev().val().trim();
                var id = $(this).attr('value');
                if(content.length==0){
                    return false;
                }

                $.ajax({
                    type: "POST",
                    url: "{:U('tosavecomment')}",
                    data:  {"content":content,'who_id':id},
                    dataType: "json",
                    success: function(rs){
                        if(rs.status == 'success'){
                            var commentlist = self.parent();
                            var divs = '<div class="media comitem">'+
                                            '<a class="pull-left" href="'+rs.url+'">'+
                                                '<img class="media-object img-rounded" src="__PUBLIC__'+rs.zonedp+'" height="35" width="35" alt="头像">'+
                                            '</a>'+
                                            '<div class="media-body hfbody">'+
                                                '<p class="small" >'+
                                                    '<strong><a href="'+rs.url+'">'+rs.name+':</a></strong>'+
                                                    rs.content+
                                                '</p>'+
                                                '<div class="small">'+
                                                    rs.ctime+
                                                    '<a href="javascript:void(0)" class="act-com-hf" comid="'+rs.id+'" hfid="'+rs.uid+'">回复</a>'+
                                                    '<a href="javascript:void(0)" class="act-com-del" dataid='+rs.id+'>删除</a>'+
                                                '</div>'+ 
                                                '<div class="huifu"  style="display:none">'+
                                                    '<textarea class="form-control" rows="2" name="content"  placeholder=""></textarea>'+
                                                    '<button class="action-hf btn btn-primary btn-sm pull-right mt10">发表</button>'+
                                                '</div>'+               
                                            '</div>'+
                                        '</div>';
                            commentlist.before(divs);
                            $("textarea[name='comment']").val(''); // 清空输入框
                        }
                    }
                });
            });
            
            //提交说说
            $('.action-subsay').on('click',function(){
                var content = $("textarea[name='content']").val().trim();
                var img = [];
                $.each($('.imgpath'),function(i,n){
                    img[i] = $(".imgpath").eq(i).val();
                })
                if(content.length==0){
                    return false;
                }
                // alert(content);

                $.ajax({
                    type: "POST",
                    url: "{:U('tosave')}",
                    data: {"content":content,'img':img},
                    dataType: "json",
                    success: function(rs){
                        if(rs.status == 'success'){
                            var saylist = $("#saylist");
                            var pic = "";
                            // console.log(img);
                            $.each(img,function(i,n){
                                pic += '<div class="pull-left mr6 mt6"><img width="180" height="160" src="__PUBLIC__/uploads/'+ n +'"></div>';
                            });
                            
                            var divs = '<div class="row sayitem mt10">'+
                                    '<div class="col-md-2">'+
                                        '<a href="'+rs.url2+'">'+
                                            '<img class="img-rounded" src="__PUBLIC__{$user.zonedp}" width="85" height="85" alt="头像">'+
                                       '</a>'+
                                    '</div>'+
                                    '<div class="col-md-10 combody" style="border:1px solid #ccc;border-radius:5px">'+
                                        '<div class="content mt10">'+
                                            '<a href="'+rs.url2+'">{$user.nickname}</a>&nbsp&nbsp&nbsp&nbsp'+rs.content+
                                        '</div>'+pic+
                                        '<div class="clear"></div>'+
                                        '<div class="row mt10">'+
                                            '<div class="ctime col-md-4">'+
                                                rs.ctime+
                                            '</div>'+
                                            '<div class="action col-md-3 col-md-offset-5">'+
                                                '<a dataid='+rs.id+' href="javascript:void(0)" class="act-fav">赞(0)</a>'+
                                                '<a href="'+ rs.url +'">编辑</a>'+
                                                '<a dataid='+rs.id+' href="javascript:void(0)" class="act-del">删除</a>'+
                                            '</div>'+
                                        '</div><hr>'+
                                        '<div class="panel-footer mt10 md10 combtn">'+
                                            '<textarea name="comment" class="form-control" rows="1" placeholder="我也说一句"></textarea>'+
                                            '<button class="action-comment btn btn-primary btn-sm pull-right mt10 md10" value="'+rs.id+'">发表</button>'+
                                        '</div>'+
                                    '</div>'+
                                '</div>';
                            saylist.prepend(divs);
                            $('#pic_tmp').empty(); // 删除ajax加载过来的图片
                            $("textarea[name='content']").val(''); // 清空输入框
                            $('#pic').val(''); // 清空选择的照片
                        }
                    }
                });
            });

            //ajax上传图片
            $("#pic").on('change',function(){
                var formData = new FormData();
                $.each($('#pic')[0].files, function(i, file) {
                    formData.append('upload_file[]', file);
                });
            
                $.ajax({
                    url: '{:U("uploadimg")}',
                    type: 'POST',
                    cache: false,
                    data: formData,
                    dataType: "json",
                    processData: false,
                    contentType: false,
                    success: function(rs){
                        // debugger;
                        var imgbox = $('#pic_tmp');
                        var lis = "";
                        $.each(rs.info,function(i,n){
                            lis += '<li><img width="100" height="100" src="__PUBLIC__/uploads/' + n.savepath + n.savename +'"><input class="imgpath" type="hidden" name="img[]" value="'+ n.savepath + n.savename +'"></li>' ;
                        });
                        imgbox.append(lis);
                    }
                });

            });

            //ajax删除图片
            $('#pic_tmp').on('click','img',function(){
                var self=$(this);
                var picname = self.next().val();
                self.parents('li').remove();
                $('#pic').val(''); // 清空选择的照片

                //ajax删除服务器的图片
                $.ajax({
                    type: "POST",
                    url: "{:U('delpic')}",
                    data: {'picname':picname},
                    dataType: "json",
                    success: function(rs){
                        // alert(rs.msg);
                    }
                });
            });
        </script>
    </block>
